<template>
    <el-dialog title="子指令" :visible.sync="dialogForm" :modal="modal" width="1100px">
        <el-table ref="multipleTable" :data="command" border stripe max-height="500"
                  @selection-change="handleSelectionChange">
            <el-table-column fixed="left" type="selection" prop="id" width="55"></el-table-column>
            <el-table-column type="index" fixed="left" label="序号" width="55"></el-table-column>
            <el-table-column prop="jobStatus" label="状态">
                <template slot-scope="scope">
                    {{ scope.row.jobStatus | _filterJobStatus }}
                </template>
            </el-table-column>
            <el-table-column prop="jobPurpose" label="作业目的">
                <template slot-scope='scope'>
                    {{ scope.row.jobPurpose | _filterJobPurpose }}
                </template>
            </el-table-column>
            <el-table-column prop="action" label="动作">
                <template slot-scope='scope'>
                    {{ scope.row.action | _filterJobAction}}
                </template>
            </el-table-column>
            <el-table-column prop="containerNo" label="箱号" min-width="110"></el-table-column>
            <el-table-column prop="presentField" label="现场位"></el-table-column>
            <el-table-column prop="presentMachine" label="作业机械" min-width="140">
                <template slot-scope='scope'>
                    <auto-search-resource v-if="scope.row.showInput&&!isFinished" searchType="JOB_JX"
                                          searchName="resourceName"
                                          :valid="true"
                                          :name="scope.row.presentMachine"
                                          @matchRecord="v=>selectMachine(v,scope.row,scope.$index)"></auto-search-resource>
                    <div v-else>{{ scope.row.presentMachine }}</div>
                </template>
            </el-table-column>
            <el-table-column prop="purposeField" label="目的场位" min-width="160">
                <template slot-scope='scope'>
                    <el-input v-if="scope.row.showInput&&!isFinished" placeholder="如:E1-01-01-1"
                              @change="changeInput(scope.row,scope.$index)"
                              v-model="scope.row.purposeField"></el-input>
                    <div v-else>{{ scope.row.purposeField }}</div>
                </template>
            </el-table-column>
            <el-table-column prop="jobTime" label="作业时间"></el-table-column>
        </el-table>
        <div slot="footer" class="dialog-footer" style="text-align: center">
            <el-button v-if="!isFinished&&power('WJOB_CONTROL_CONTAINER_COMMAND:EXECUTE')" type="primary"
                       @click="handleClick('submit')" :loading="$store.getters.loadingBtn">执 行
            </el-button>
            <el-button type="primary" v-if="power('WJOB_CONTROL_CONTAINER_COMMAND:WITHDRAW')" @click="handleClick('')"
                       :loading="$store.getters.loadingBtn">撤 回
            </el-button>
            <el-button @click="dialogForm = false">取 消</el-button>
        </div>
    </el-dialog>
</template>

<script>
    import {
        commandExecute,
        commandRevoke,
        instructionsPosition
    } from "@/api/middleControl/middleControl";
    import autoSearchResource from '@/components/autocomplete/autoSearchResource'

    export default {
        name: "commandForm",
        components: { autoSearchResource },
        props: {
            isFinished: {
                type: Boolean,
                default: false
            },
            modal:{
                type:Boolean,
                default:true,
            }
        },
        data() {
            return {
                dialogForm: false,
                command: [],
                commandSelect: []
            };
        },
        methods: {
            handleSelectionChange(item) {
                this.commandSelect = JSON.parse(JSON.stringify(item));
            },
            handleClick(type) {
                if (this.commandSelect.length === 0) {
                    this.$message({ message: "请选择一条数据", type: "error" });
                    return;
                }
                type === "submit" ? this.handleSubmit() : this.handleCancel();
            },
            handleSubmit() {
                let data = [];
                for (let i = 0; i < this.commandSelect.length; i++) {
                    const element = this.commandSelect[i];
                    const params = {
                        id: element.id,
                        areaNo: element.purposeField,
                        presentMachineId:element.presentMachineId
                    };
                    data.push(params);
                }
                commandExecute(data).then(res => {
                    this.$message({ message: "执行成功!", type: "success" });
                    this.dialogForm = false;
                    this.isFinished ? this.$emit("load") : this.$emit("loadUn");
                });
            },
            handleCancel() {
                let data = [];
                for (let i = 0; i < this.commandSelect.length; i++) {
                    const element = this.commandSelect[i];
                    data.push({ id: element.id });
                }
                commandRevoke(data).then(res => {
                    this.$message({ message: "撤回成功!", type: "success" });
                    this.dialogForm = false;
                    this.isFinished ? this.$emit("load") : this.$emit("loadUn");
                });
            },
            changeInput(item, index) {
                console.log(item, index);
                let selectNo = null;
                this.commandSelect.map((m, i) => {
                    selectNo = m.id === item.id ? i : null;
                });
                this.commandSelect[selectNo].purposeField = item.purposeField;
                // if(item.length===10&&item.split('-').length===3){
                //     console.log('匹配');
                // }else{
                //     let a=item.substr(0,2)
                //     let b=item.substr(2,4)
                //     let r=item.substr(4,6)
                //     let t=item.substr(6,7)
                //     this.command[index].purposeField=a+'-'+b+'-'+r+'-'+t
                // }
            },
            selectMachine(val, item, index) {
                if(item.purposeField){
                    let selectNo = null;
                    this.commandSelect.map((m, i) => {
                        selectNo = m.id === item.id ? i : null;
                    });
                    this.commandSelect[selectNo].presentMachine = val.resourceName
                    this.commandSelect[selectNo].presentMachineId = val.id
                    this.command[index].presentMachineId = val.id
                    this.command[index].presentMachine = val.resourceName
                }else{
                    let data = {
                        id: item.id,
                        purposeMachine: val.resourceName,
                        purposeMachineId: val.id,
                    }
                    instructionsPosition(data).then(res => {
                        let selectNo = null;
                        this.commandSelect.map((m, i) => {
                            selectNo = m.id === item.id ? i : null;
                        });
                        this.commandSelect[selectNo].purposeField = res.data
                        this.commandSelect[selectNo].presentMachine = val.resourceName
                        this.commandSelect[selectNo].presentMachineId = val.id
                        this.command[index].presentMachine = val.resourceName
                        this.command[index].presentMachineId = val.id
                        this.command[index].purposeField = res.data
                    })
                }
            }
        },
        computed: {
            commandLength() {
                return this.command.length
            }
        },
        watch: {
            dialogForm(bool) {
                if (!bool) {
                    this.commandSelect = [];
                    this.command = []
                }
            },
            commandLength(length) {
                if (length === 1) {
                    this.$nextTick(() => {
                        this.$refs.multipleTable.toggleRowSelection(this.command[0])
                    })
                }
            }
        }
    };
</script>

<style scoped>
</style>
